<!doctype html>
<html lang="zh">
  <head>
    <meta charset="UTF-8" />
    <link rel="icon" href="https://img.alicdn.com/tfs/TB1_ZXuNcfpK1RjSZFOXXa6nFXa-32-32.ico" type="image/x-icon" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>示例网站</title>
    <link
      rel="icon"
      href="https://img.alicdn.com/tfs/TB1_ZXuNcfpK1RjSZFOXXa6nFXa-32-32.ico"
      type="image/x-icon"
    />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>示例网站</title>
    <link
      href="//g.alicdn.com/??aliyun/dbl-official-ui/2.0.1/css/index.css,dawn/ace-element/0.0.60/index.css,hmod/ace-grid-layout-2023/0.0.5/index.css"
      rel="stylesheet"
    />
    <link
      href="//g.alicdn.com??code/npm/@ali/hmod-ace-2023-box/0.1.0/index.css,code/npm/@ali/hmod-ace-2023-service-contact-us/0.0.24/index.css,code/npm/@ali/hmod-aliyun-com-floating-toolbar/0.1.6/index.css,code/npm/@ali/hmod-aliyun-com-global-nav-search/0.5.10/index.css,code/npm/@ali/hmod-aliyun-com-global-nav/0.1.20/index.css,hmod/ace-2023-homepage-banner/0.1.11/index.css,hmod/ace-2023-homepage-news/0.1.5/index.css,hmod/ace-common-aliyun-index-title/0.0.4/index.css,hmod/ace-common-row-aliyun-free-trial/0.0.4/index.css,hmod/ace-common-row-aliyun-standard/0.0.8/index.css,hmod/ace-common-row-basic-product-datas/0.0.6/index.css,hmod/ace-common-row-entry-alicloud-service/0.0.6/index.css,hmod/ace-customer-case-home/0.1.1/index.css,hmod/ace-dpl-home-map/0.1.0/index.css,hmod/ace-dpl-home-product-category/0.1.0/index.css,hmod/ace-dpl-home-row-best-practices/0.0.10/index.css,hmod/ace-dpl-new-to-link/0.0.8/index.css,hmod/ace-homepage-2020-hmod-footer/0.1.5/index.css,hmod/ace-index-card-product-trial-service/0.0.5/index.css"
      rel="stylesheet"
    />
  </head>
  <body>
    <!-- <script src="demo_layout.js"></script> -->
    <script>
      window.CHATBOT_CONFIG = {
        endpoint: '/chat',
        displayByDefault: false, // 默认不展示 AI 助手聊天框
        draggable: true, // 是否开启拖拽
        aiChatOptions: { // aiChatOptions 中 options 会传递 aiChat 组件，自定义取值参考：https://docs.nlkit.com/nlux/reference/ui/ai-chat
          conversationOptions: { // 自定义取值参考：https://docs.nlkit.com/nlux/reference/ui/ai-chat#conversation-options
            conversationStarters: [
              {prompt: '阿里云什么时间成立的？'},
              {prompt: '为什么说弹性是云的最大优势?'},
              {prompt: '为什么选择阿里云？'},
            ]
          },
          displayOptions: { // 自定义取值参考：https://docs.nlkit.com/nlux/reference/ui/ai-chat#display-options
            height: 600,
            // width: 400,
          },
          personaOptions: { // 自定义取值参考：https://docs.nlkit.com/nlux/reference/ui/ai-chat#chat-personas
            assistant: {
              name: '你好，我是你的 AI 助手',
              // AI 助手的图标
              avatar: 'https://img.alicdn.com/imgextra/i2/O1CN01Pda9nq1YDV0mnZ31H_!!6000000003025-54-tps-120-120.apng',
              tagline: '您可以尝试点击下方的快捷入口开启体验！',
            }
          }
        },
        dataProcessor: {
          /**
           * 在向后端大模型应用发起请求前改写 Prompt。
           * 可以用于总结网页场景，在发送前将网页内容包含在内，同时避免在前端显示这些内容。
           * @param {string} prompt - 用户输入的 Prompt
           */
          rewritePrompt(prompt) {
            return prompt;
          }
        }
      };
    </script>
    <script type="module" src="/src/main.tsx"></script>
    <style>
      :root {
        /* webchat 工具栏的颜色 */
        --webchat-toolbar-background-color: #1464E4;
        /* webchat 工具栏文字和按钮的颜色 */
        --webchat-toolbar-text-color: #FFF;
      }
      /* webchat 对话框如果被遮挡，可以尝试通过 z-index、bottom、right 等设置 来调整*/
      .webchat-container {
        z-index: 100;
        bottom: 10px;
        right: 10px;
      }
      /* webchat 的唤起按钮如果被遮挡，可以尝试通过 z-index、bottom、right 等设置 来调整*/
      .webchat-bubble-tip {
        z-index: 99;
        bottom: 20px;
        right: 20px;
      }
    </style>
  </body>
</html>
